<template>
    <div class="films-box">
        <div class="list-name">
            <span>热门电影</span>
        </div>
        <film-list class="content-list" :list="films"></film-list>
    </div>
</template>
<script>
    const Films = Vue.extend({
        template: document.currentScript.ownerDocument.querySelector("template"),
        components: {
            navBar: navBar,
            // filmItem:filmItem
            filmList: filmList
        },
        data(){
            return{
                films: []
            }
        },
        methods: {
            filmItems() {
                $.ajax({
                    url: "http://localhost/filmApi/loadFilms.php",
                    dataType: "json",
                    data: {
                        size: 17
                    },
                    success: ({ result }) => {
                        // console.log(result);
                        this.films = result;
                    }
                })
            }
        },
        mounted() {
            this.filmItems();
        }
    })
</script>